---
id: 5dc23991f86c76b9248c6eb8
title: Paso 6
challengeType: 0
dashedName: step-6
---

# --description--

En el paso anterior, has colocado los elementos `h1`, `h2`, comentario y `p` dentro del elemento `main`. Esto se llama *anidamiento*. Los elementos anidados deben colocarse dos espacios más a la derecha del elemento en el que están anidados. Este espacio se llama sangría (indentación en programación) y se utiliza para facilitar la lectura de HTML.

Here is an example of nesting and indentation:

```html
<main>
  <h1>Most important content of the document</h1>
  <p>Some more important content...</p>
</main>
```

En el código que sigue, los elementos `h1`, `h2` y el comentario tienen dos espacios más de indentación que el elemento `main`. Utiliza la barra espaciadora de tu teclado para añadir dos espacios más delante del elemento `p` para que también tenga la sangría adecuada.

# --hints--

Tu código debe tener un elemento `h2` con el texto `Cat Photos`. Puede que lo hayas eliminado accidentalmente, faltan las etiquetas de apertura y de cierre o el texto ha sido modificado.

```js
assert(
  document.querySelector('h2') &&
    code.match(/<\/h2\>/) &&
    document.querySelector('h2').innerText.toLowerCase() === 'cat photos'
);
```

No debes añadir los elementos `ul` o `li` del ejemplo.

```js
assert(
  !document.querySelector('ul') && !document.querySelector('li')
);
```

No debes cambiar la sangría de la línea con tu elemento `h2`. Tu etiqueta de apertura debe comenzar a 6 espacios del inicio de la línea. Puedes reiniciar el paso para restaurar la sangría original.

```js
assert(code.toLowerCase().match(/<\/h1\>\s*\n\s{6}<h2>/));
```

Tu código debe tener un comentario. Eliminaste el comentario de uno de los pasos anteriores.

```js
assert(code.match(/<!--.*-->/));
```

El texto del comentario debe ser `TODO: Add link to cat photos`. No cambies el texto o los espacios del comentario.

```js
assert(code.match(/<!--\s*todo:\s+add\s+link\s+to\s+cat\s+photos\.?\s*-->/i));
```

No debes cambiar la sangría de la línea con tu elemento de comentario. Tu etiqueta de apertura debe comenzar a 6 espacios del inicio de la línea. Puedes reiniciar el paso para restaurar la sangría original.

```js
assert(
  code
    .toLowerCase()
    .match(/<\/h2>\s*\n\s{6}<!--\s*todo:\s+add\s+link\s+to\s+cat\s+photos\s*-->/)
);
```

Tu código debe tener un elemento `p`. Eliminaste el elemento `p` de uno de los pasos anteriores.

```js
assert(document.querySelector('p'));
```

El texto del elemento `p` debe ser `See more cat photos in our gallery.` No cambies el texto, el espaciado, o puntuación del elemento `p`.

```js
assert(
  document
    .querySelector('p')
    .innerText.toLowerCase()
    .match(/see\s+more\s+cat\s+photos\s+in\s+our\s+gallery\.?$/)
);
```

La etiqueta `p` de apertura debe tener una sangría que coincida con tu elemento `h2` y tu elemento de comentario. Tu etiqueta de apertura debe comenzar a 6 espacios del inicio de la línea.

```js
assert(code.toLowerCase().match(/-->\s*\n\s{6}<p>/));
```

# --seed--

## --seed-contents--

```html
<html>
  <body>
    --fcc-editable-region--
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
    <p>See more cat photos in our gallery.</p>
    </main>
--fcc-editable-region--
  </body>
</html>
```

